<template>
	<div>
		<div class="container">
			<div class="row">
				<h3 :style="{ fontSize: (data1.size == 'sm' ? '.95em' : '') }" style="color: #1d6bff;">{{ data1.title
					}}
				</h3>
			</div>
			<div class="row text-left d-flex align-content-sm-start p-0 mr-1 mt-2">
				<div class="col-10 col-sm-10 col-md-7 col-lg-5 col-xl-4  p-0 text-left">
					<h2 class="text-left p-0" style="font-size: 2rem;white-space: nowrap; ">{{ data1.text }}</h2>
				</div>
				<div class="col-2 col-sm-2 col-md-5 col-lg-7 mb-3 p-0 mb-2 ml-0   text-left d-flex align-items-center">
					<img style="width: 80px;" class="p-0 d-none d-sm-block"
						src="https://www.fluxmq.com/static/img/right.70138b26.svg" alt="">
					<img style="width: 80px;" class="ml-4 d-block d-sm-none pl-2"
						src="https://www.fluxmq.com/static/img/right.70138b26.svg" alt="">
				</div>

			</div>
		</div>
	</div>
</template>

<script>
export default {
	props: {
		data1: {
			type: Object,
			default: (() => { })
		}
	}

}
</script>

<style lang="scss" scoped>
.card {
	background-color: #fff;
	border: none;
}
</style>